﻿
@{
    ViewBag.Title = "用户管理";
    Layout = "~/Views/Shared/_LayuiLayout.cshtml";
}
<blockquote class="layui-elem-quote">
    <div class="pos-r h-38" id="topbar">
        <span>
            @{
                bool isHasRow; // 是否有行操作
            }
            @Html.SysMenuButton(MenuPosType.行列, out isHasRow)
        </span>
        <span class="pos-a pos-right">
            <span class="layui-inline">
                <button class="layui-btn " data-type="Search"><i class="layui-icon">&#xe615;</i>搜索</button>
            </span>
            <span class="layui-inline">
                <button type="button" class="layui-btn" data-type="Reload"><i class="layui-icon">&#xe669;</i>刷新</button>
            </span>
        </span>
    </div>
</blockquote>
<!-- 数据表格 -->
<table id="tbList" lay-filter="tbList"></table>
<!--搜索表单-->
<div class="hidden" id="SearchTmpl">
    <form class="layui-form layui-form-pane">
        <div class="layui-form-item">
            <label class="layui-form-label">用户姓名</label>
            <div class="layui-input-block">
                <input type="text" name="RealName" autocomplete="off" class="layui-input" placeholder="请输入用户姓名" />
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">角色名称</label>
            <div class="layui-input-block">
                <input type="text" name="RoleName" autocomplete="off" class="layui-input" placeholder="请输入角色名称" />
            </div>
        </div>
        <div class="layui-form-item">
            <button type="button" class="layui-btn" lay-submit="" lay-filter="search"><i class="layui-icon">&#xe615;</i>搜索</button>
            <button type="button" class="layui-btn layui-btn-primary" onclick="layer.closeAll();">关闭</button>
        </div>
    </form>
</div>


<script type="text/html" id="tmplSex">
    {{# if(d.Sex==1){ }}
    男
    {{# }else{ }}
    女
    {{# } }}
</script>
<script type="text/html" id="tmplIsLock">
    {{# if(d.IsLock==0){ }}
    <span class="c-green">未锁定</span>
    {{# }else{ }}
    <span class="c-red">已锁定</span>
    {{# } }}
</script>
@section scripts{
    <script>
        var $, layer;
        layui.use(['table', 'form'], function () {
            var table = layui.table
              , form = layui.form;
            $ = layui.jquery;
            layer = layui.layer;

            //执行渲染
            table.render({
                elem: '#tbList',
                height: 'full-128',
                url: '@Url.Action("GetUserList", "User")',
                method: 'post',
                page: true,
                cols: [[
                    { type: 'checkbox', fixed: 'left', unresize: true, width: 40 },
                    { field: 'UserName', title: '用户名', sort: true },
                    { field: 'RealName', title: '姓名', sort: true },
                    { field: 'RoleName', title: '角色名称', sort: true },
                    { field: 'Sex', title: '性别', sort: true, templet: '#tmplSex' },
                    { field: 'Tel', title: '座机号码', sort: true },
                    { field: 'Phone', title: '手机号码', sort: true },
                    { field: 'IsLock', title: '是否锁定', sort: true, templet: '#tmplIsLock' },
                    { title: '操作', width: 160, fixed: 'right', align: 'center', unresize: true, toolbar:'#barOperation' },
                ]]
            });

            //刷新
            reload = function () {
                table.reload('tbList');
            }

            var active = {
                Reload: function () {
                    reload();
                },
                Search: function () {
                    layer_show(1, "高级检索", $("#SearchTmpl"), '400px', "100%", "r");
                    form.render();//重新渲染表单
                },
                Add: function () {
                    layer_show('', '添加用户', '@Url.Action("AddOrEditView", "User")', '100%', '100%');
                },
                Edit: function () {
                    var data = table.checkStatus('tbList').data;//获取表格选中行
                    if (CheckSingle(data.length, layer)) {
                        layer_show('', '修改用户', '@Url.Action("AddOrEditView", "User")' + '?Id=' + data[0].Id, '100%', '100%');
                    }
                },
                Role: function () {
                    var data = table.checkStatus('tbList').data;
                    if (CheckSingle(data.length, layer)) {
                        layer_show('', '设置角色' + '(' + data[0].RealName + ')', '@Url.Action("SetUserRole", "User")' + "?Id=" + data[0].Id, '100%', '100%');
                    }
                },
                Password: function () {
                    var data = table.checkStatus('tbList').data;
                    if (CheckSingle(data.length, layer)) {
                        layer.confirm('确定重置 <b>' + data[0].RealName + '</b> 的密码吗？', function myfunction() {
                            var loading = layer.load(1);
                            $.post('@Url.Action("ResetPassword", "User")/' + data[0].Id, function (msg) {
                                if (msg.Success) {
                                    layer.alert(msg.Message, { icon: 1, time: 10000 });
                                    layer.close(loading);
                                } else {
                                    layer.alert(msg.Message, { icon: 2 });
                                    layer.close(loading);
                                }
                            });
                        });
                    }
                },
                Delete: function () {
                    var checkStatus = table.checkStatus('tbList');//获取表格选中行
                    var data = checkStatus.data;//获取选中行的数据
                    if (CheckMultiple(data.length, layer, '删除')) {
                        layer.confirm('确认要删除吗?', function (index) {
                            var loading = layer.load(1);
                            $.post(
                                '@Url.Action("DeleteList", "User")',
                                { IdList: GetIdList(data) },
                                function (result) {
                                    layer.close(index);
                                    if (result.Success) {
                                        layer.msg(result.Message, { icon: 1, time: 3000 });
                                        reload();
                                        layer.close(loading);
                                    } else {
                                        layer.alert(result.Message, { icon: 2 });
                                        layer.close(loading);
                                    }
                                });
                        });
                    }
                },
                Lock: function () {
                    var checkStatus = table.checkStatus('tbList');//获取表格选中行
                    var data = checkStatus.data;//获取选中行的数据
                    if (CheckMultiple(data.length, layer, '解锁')) {
                        layer.confirm('确认要解除锁定吗?', function (index) {
                            var loading = layer.load(1);
                            $.post(
                                '@Url.Action("Lock", "User")',
                                { IdList: GetIdList(data) },
                                function (result) {
                                    layer.close(index);
                                    if (result.Success) {
                                        layer.msg(result.Message, { icon: 1, time: 3000 });
                                        reload();
                                        layer.close(loading);
                                    } else {
                                        layer.alert(result.Message, { icon: 2 });
                                        layer.close(loading);
                                    }
                                });
                        });
                    }
                },
            };
            //获取并拼接数据中id的值
            function GetIdList(data) {
                var IdList = "", douhao = "";
                for (var i = 0; i < data.length; i++) {
                    IdList += douhao + data[i].Id; douhao = ',';
                }
                return IdList;
            }

            form.on('select(state)', function (data) {
                var urls = '@Url.Action("GetUserList", "User")';
                var name = $(data.elem).attr("name");
                if (name == "ProvinceCode") {
                    getJSON(urls, $("#CityCode"));
                    $("#DistrictCode").empty();//清空区数据
                }
            });
            function getJSON(urls, even) {
                $.post(urls, function (json) {
                    var name = even.find("select").attr("name");
                    var select = '<select id="' + name + '" name="' + name + '" lay-filter="state" lay-verify="required">';
                    select += '<option value="">请选择</option>';
                    $(json).each(function () {
                        select += '<option value="' + this.Code + '">' + '</option>';
                    });
                    select += '</select>';
                    even.html(select);
                    form.render('select');
                });
            }

            //监听表头按钮点击
            $('#topbar .layui-btn').on('click', function () {
                var type = $(this).data('type');
                active[type] ? active[type].call(this) : '';
            });

            //监听工具条
            table.on('tool(tbList)', function (obj) {
                var data = obj.data;
                switch (obj.event) {
                    case 'Edit': layer_show('', '修改', '@Url.Action("AddOrEditView", "User")' + '?Id=' + data.Id, '100%', '100%'); break;
                    case 'SetPerm': layer_show('', '设置角色' + '(' + data.RealName + ')', '@Url.Action("SetPermissions", "Role")' + '?Id=' + data.Id, '100%', '100%'); break; break;
                }
            });

            //高级搜索提交按钮事件
            form.on('submit(search)', function (data) {
                window.SearchField = data.field;//存储查询条件
                //传入搜索参数并重新加载当前表格
                table.reload('tbList', {
                    where: data.field,
                    page: { curr: 1 /*重新从第 1 页开始*/ }
                });
                layer.closeAll();//关闭高级搜索框
                return false;
            });
        });
    </script>
}
